<template>
  <div>
    <h1>图表组件--柱状图--首页：领域分布</h1>
    <v-chart theme="technology" :options="options" :auto-resize="true"/>
  </div>
</template>

<script>
export default {
  name: "ChartBar",
  data() {
    return {
      options: {}
    };
  },
  mounted() {
    this.options = {
      tooltip: {
        trigger: "axis",
        axisPointer: {
          type: "shadow"
        }
      },
      legend: {
        show: false,
        data: ["2011年"]
      },
      grid: {
        left: "3%",
        right: "4%",
        bottom: "3%",
        containLabel: true
      },
      xAxis: {
        show: false
      },
      yAxis: {
        type: "category",
        data: ["巴西", "印尼", "美国", "印度", "中国", "总数(万)"]
      },
      series: [
        {
          name: "2011年",
          type: "bar",
          data: [18203, 23489, 29034, 104970, 131744, 630230]
        }
      ]
    };
  }
};
</script>